<template>
  <div class="card">
    <!-- 标签栏 -->
    <div class="mydocument-box">
      <template v-for="(item,i) in dataSource">
        <div :key="i" class="mydocument-item">
          <span><a href="javascript:;" @click="showAnnouncement(item)">{{item.titile}}</a></span>
          <span class="name-item">{{item.sender_dictText}}</span>
          <span class="name-item">{{getPriority(item.priority)}}</span>
          <span>{{item.sendTime}}</span>
        </div>
      </template>
    </div>
    <show-announcement ref="ShowAnnouncement"></show-announcement>
  </div>
</template>

<script>
import { getAction, putAction } from '@/api/manage'
import ShowAnnouncement from '@/components/tools/ShowAnnouncement'
export default {
  components: {
    ShowAnnouncement
  },
  data() {
    return {
      url: {
        list: '/sys/sysAnnouncementSend/getMyAnnouncementSend',
        editCementSend: 'sys/sysAnnouncementSend/editByAnntIdAndUserId'
      },
      ipagination: {
        current: 1,
        pageSize: 5,
        pageSizeOptions: ['10', '20', '30'],
        showTotal: (total, range) => {
          return range[0] + '-' + range[1] + ' 共' + total + '条'
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0
      },
      dataSource: [],
      loading: false,
      openPath: '',
      formData: {}
    }
  },
  methods: {
    loadData() {
      if (!this.url.list) {
        this.$message.error('请设置url.list属性!')
        return
      }
      this.loading = true
      getAction(this.url.list, {
        pageNo: 1,
        pageSize: 5
      }).then((res) => {
        if (res.success) {
          this.dataSource = res.result.records
          this.ipagination.total = res.result.total
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
        this.loading = false
      })
    },
    getPriority(text) {
      if (text === 'L') {
        return '低'
      } else if (text === 'M') {
        return '中'
      } else if (text === 'H') {
        return '高'
      } else {
        return text
      }
    },
    showAnnouncement(record) {
      putAction(this.url.editCementSend, { anntId: record.anntId }).then((res) => {
        if (res.success) {
          this.syncHeadNotic(record.anntId)
        }
      })
      if (record.openType === 'component') {
        this.openPath = record.openPage
        this.formData = { id: record.busId }
        this.$refs.showDynamNotice.detail()
      } else {
        this.$refs.ShowAnnouncement.detail(record)
      }
    },
    syncHeadNotic(anntId) {
      getAction('sys/annountCement/syncNotic', { anntId: anntId })
    }
  },
  mounted() {
    this.loadData()
  }
}
</script>

<style scoped>

.card {
  height: 100%;
}
.mydocument-item {
  display: grid;
  grid-template-columns: 6fr 1fr 0.5fr 2.5fr;
  height: 40px;
  cursor: pointer;
  font-size: 14px;
  line-height: 40px;
}
.mydocument-item > * {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
i{
  line-height: 40px;
}
</style>
